<template>
<div style="font-size: 12px;">
	    <el-dialog title="服务器" size="small" :visible.sync="show">
		<el-form :model="info" ref="info" :rules="rules">
			<el-row :gutter="24" style="margin-bottom: 0px;padding-top:10px;border-top: 1px solid #dfe6ec;"> 
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item prop="device_base.eqptType" label="设备类型" :label-width="'35%'" style="margin: 0;margin-bottom:5px;">
						<el-select v-model="info.device_base.eqptType" placeholder="请选择设备类型" :style=""
							:disabled="disable.eqptType ? true : false">
	                        <el-option v-for="list in select.eqptType" :key="list.id" :label="list.dictValue" :value="list.dictKey.toString()"></el-option>
	                    </el-select>
	               	</el-form-item>  									
				</el-col>
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item prop="device_base.brandId" label="品牌名称" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;">
						<el-select v-model="info.device_base.brandId" placeholder="请选择品牌名称" :style="">
	                        <el-option v-for="list in select.brandType" :key="list.brandId" :label="list.brandName" :value="list.brandId.toString()"></el-option>
	                    </el-select>
					</el-form-item>
				</el-col>
				<el-col :xs="8" :sm="8" :md="8" :lg="8"> 
					<el-form-item prop="device_base.modelId" label="设备型号" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;">
						<el-select v-model="info.device_base.modelId" placeholder="请选择设备型号" :style="">
	                        <el-option v-for="list in select.model" :key="list.modelId" :label="list.modelName" :value="list.modelId.toString()"></el-option>
	                    </el-select>
		            </el-form-item>				
				</el-col>										 
			</el-row>
			<el-row :gutter="24" style="border-bottom: 1px solid #dfe6ec;margin-bottom:5px;"> 
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item prop="device_base.snNum" label="SN编号" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_base.snNum" placeholder="请输入SN编号"></el-input>
					</el-form-item>  									
				</el-col>
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
		               <el-form-item prop="device_base.eqptSpec" label="设备规格" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;">
						<el-select v-model="info.device_base.eqptSpec" placeholder="请选择设备规格" :style="">
	                        <el-option v-for="list in select.eqptSpec" :key="list.id" :label="list.dictValue" :value="list.dictKey.toString()"></el-option>
	                    </el-select>
		               </el-form-item>
				</el-col>
				<el-col :xs="8" :sm="8" :md="8" :lg="8"> 
					<el-form-item prop="device_server.serviceCode" label="服务代码" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_server.serviceCode" placeholder="请输入服务代码"></el-input>
		            </el-form-item>				
				</el-col>										 
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;"> 
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[' + '0' + '].brandId'" label="CPU品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[0].brandId" placeholder="请选择CPU品牌" @change="getUnitName($event,'0',select.cpuBrands)">
	                        <el-option v-for="list in select.cpuBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[' + '0' + '].capacity'" label="CPU核数" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[0].capacity" placeholder=""></el-input>
					</el-form-item>
				</el-col>
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[' + '0' + '].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[0].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;"> 	
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[1].brandId'" label="内存品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[1].brandId" placeholder="请选择内存品牌" @change="getUnitName($event,'1',select.memoryBrands)">
	                        <el-option v-for="list in select.memoryBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
		               <el-form-item :prop="'device_unit[1].capacity'" label="内存容量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
	                    <el-input v-model="info.device_unit[1].capacity" placeholder=""></el-input>
		               </el-form-item>
				</el-col>
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[1].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[1].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;"> 	
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[2].brandId'" label="网卡品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[2].brandId" placeholder="请选择网卡品牌" @change="getUnitName($event,'2',select.netCardBrands)">
	                        <el-option v-for="list in select.netCardBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[2].amount'" label="数量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[2].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;">
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[3].brandId'" label="电源品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[3].brandId" placeholder="请选择电源品牌" @change="getUnitName($event,'3',select.sourceBrands)">
	                        <el-option v-for="list in select.sourceBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[3].amount'" label="数量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[3].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>				
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;">
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[4].brandId'" label="硬盘品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[4].brandId" placeholder="请选择硬盘品牌" @change="getUnitName($event,'4',select.hardDiskBrands)">
	                        <el-option v-for="list in select.hardDiskBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[4].capacity'" label="硬盘容量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[4].capacity" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>						
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[4].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[4].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;">
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[5].brandId'" label="硬盘品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[5].brandId" placeholder="请选择硬盘品牌" @change="getUnitName($event,'5',select.hardDiskBrands)">
	                        <el-option v-for="list in select.hardDiskBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[5].capacity'" label="硬盘容量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[5].capacity" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>						
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[5].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[5].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;">
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[6].brandId'" label="硬盘品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[6].brandId" placeholder="请选择硬盘品牌" @change="getUnitName($event,'6',select.hardDiskBrands)">
	                        <el-option v-for="list in select.hardDiskBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[6].capacity'" label="硬盘容量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[6].capacity" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>						
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[6].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[6].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
			<el-row :gutter="24" style="margin-top:5px;margin-bottom:5px;">
				<el-col :xs="8" :sm="8" :md="8" :lg="8">
					<el-form-item :prop="'device_unit[7].brandId'" label="硬盘品牌" :label-width="'35%'" style="margin-left: 0;margin-bottom:5px;font-size:12px">
						<el-select v-model="info.device_unit[7].brandId" placeholder="请选择硬盘品牌" @change="getUnitName($event,'7',select.hardDiskBrands)">
	                        <el-option v-for="list in select.hardDiskBrands" :key="list.brandId" :label="list.brandName" :value="list.brandId"></el-option>
	                    </el-select>								
					</el-form-item>  									
				</el-col>
				<el-col :xs="7" :sm="7" :md="7" :lg="7">
					<el-form-item :prop="'device_unit[7].capacity'" label="硬盘容量" :label-width="'60%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[7].capacity" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>						
				<el-col :xs="5" :sm="5" :md="5" :lg="5"> 
					<el-form-item :prop="'device_unit[7].amount'" label="数量" :label-width="'50%'" style="margin-left: 0;margin-bottom:5px;">
						<el-input v-model="info.device_unit[7].amount" placeholder=""></el-input>
		            </el-form-item>				
				</el-col>
			</el-row>
		</el-form>			
        <div slot="footer" class="dialog-footer">
            <el-button @click="show = false">取 消</el-button>
            <el-button type="primary" @click="submitForm()">确 定</el-button>
        </div>
    </el-dialog>
</div>
</template>
<style>
</style>
<script>
export default {
	name : 'server-manage',
	props : {
		server : {
			type : Object,
			default : null
		},
	},
	data () {
		return {
			show : false,
			operate : 'New',
			disable : {},
			select : {
				eqptType : '',
				brandType : '',
				model : '',
				eqptSpec : '',
				cpuBrands : '',
				memoryBrands : '',
				sourceBrands : '',
				netCardBrands : '',
				hardDiskBrands : ''
			},
			temp : {},
			info : {
				device_base : {
					"modelName" : "",
					"brandName" : "",
					"eqptSpec" : "",
					"specName" : "",
					"modelId" : '',
					"brandId" : "",
					"typeName" : "",
					"eqptType" : "",
					"snNum" : ""
				},
				device_server : {
					"hostName" : "",
					"manageIp" : "",
					"purpose" : "",
					"serviceCode" : "",
					"ipmiAddr" : "",
					"sysModel" : ""
				},
				device_unit : [ {
					'unitType' : '1',
					'brandName' : '',
					'amount' : '',
					'brandId' : '',
					'typeName' : '',
					'capacity' : ''
				},
					{
						'unitType' : '2',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '3',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '4',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '5',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '5',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '5',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					},
					{
						'unitType' : '5',
						'brandName' : '',
						'amount' : '',
						'brandId' : '',
						'typeName' : '',
						'capacity' : ''
					} ]
			},
			rules : {
				'device_base.eqptType' : [
					{
						required : true,
						message : ''
					},
				],
				'device_base.brandId' : [
					{
						required : true,
						message : ''
					},
				],
				'device_base.modelId' : [
					{
						required : true,
						message : ''
					},
				],
				'device_base.snNum' : [
					{
						required : true,
						message : ''
					},
				],
				'device_base.eqptSpec' : [ {
					required : true,
					message : ''
				} ],
				'device_server.serviceCode' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[0].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[0].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[0].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[1].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[1].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[1].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[2].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[2].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[3].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[3].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[4].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[4].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[4].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[5].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[5].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[5].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[6].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[6].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[6].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[7].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[7].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[7].amount' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[8].brandId' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[8].capacity' : [ {
					required : true,
					message : ''
				} ],
				'device_unit[8].amount' : [ {
					required : true,
					message : ''
				} ]
			},
		}
	},
	watch : {
		'info.device_base.eqptType' : function(val, old) {
			if (val === old) return;
			this.disable.eqptType = true;
			if (this.select.eqptType) {
				this.select.eqptType.forEach(e => {
					if (e.dictKey === val) {
						this.info.device_base.typeName = e.dictValue;
					}
				});
			}
			this.getBrands(val).then(_ => {
				if (this.select.brandType) {
					let exist = false;
					if (this.temp.deviceBaseBrandId) {
						this.info.device_base.brandId = this.temp.deviceBaseBrandId + '';
						this.temp.deviceBaseBrandId = null;
					}
					this.select.brandType.forEach((b) => {
						if (parseInt(b.brandId) === parseInt(this.info.device_base.brandId) && b.brandName === this.info.device_base.brandName) {
							exist = true;
						}
					});
					if (!exist) {
						this.info.device_base.brandId = '';
					}
				}
			});
		},
		'info.device_base.brandId' : function(val, old) {
			if (val === old) return;
			if (this.select.brandType) {
				this.select.brandType.forEach(e => {
					if (String(e.brandId) === String(val)) {
						this.info.device_base.brandName = e.brandName;
					}
				});
				this.getModels(val).then(_ => {
					if (this.temp.deviceBaseModelId) {
						this.info.device_base.modelId = this.temp.deviceBaseModelId + '';
						this.temp.deviceBaseModelId = null;
					}
					if (this.select.model) {
						let exist = false;
						this.select.model.forEach((b) => {
							if (parseInt(b.modelId) === parseInt(this.info.device_base.modelId) && b.modelName === this.info.device_base.modelName) {
								exist = true;
							}
						});
						if (!exist) {
							this.info.device_base.modelId = '';
						}
					}
				});
			} else {
				this.temp.deviceBaseBrandId = val && val !== '' ? val + '' : this.temp.deviceBaseBrandId;
				this.info.device_base.brandId = '';
			}
		},
		'info.device_base.modelId' : function(val, old) {
			if (val === old) return;
			if (this.select.model) {
				this.select.model.forEach(e => {
					if (e.modelId === val) {
						this.info.device_base.modelName = e.modelName;
					}
				});
			} else {
				this.temp.deviceBaseModelId = val && val !== '' ? val : this.temp.deviceBaseModelId;
				this.info.device_base.modelId = '';
			}
		}
	},
	created : function() {
		this.init();
		this.disable.eqptType = true;
	},
	mounted : function() {
		if (this.server) {
			this.disable.eqptType = false;
			this.info.device_base = this.server.deviceBase ? this.server.deviceBase : this.info.device_base;
			this.info.device_server = this.server.deviceServer ? this.server.deviceServer : this.info.device_server;
			this.info.device_unit = this.server.deviceUnit ? this.server.deviceUnit : this.info.device_unit;
			this.operate = 'Update';
		} else {
			this.operate = 'New';
		}
	},
	updated : function() {
		if(!this.server) {
			this.info.device_base.eqptType = '1';
		}
	},
	beforeUpdate : function() {
		
	},
	methods : {
		init : function() {
			this.dict.get('eqpt_type').then(response => {
				this.select.eqptType = response;
			}).catch(error => {
				console.log(JSON.stringify(error))
			});
			this.dict.get('eqpt_spec').then(response => {
				this.select.eqptSpec = response;
			}).catch(error => {
				console.log(JSON.stringify(error))
			});
			this.getBrands('6');
			this.getBrands('7');
			this.getBrands('8');
			this.getBrands('9');
			this.getBrands('10');
		},
		getBrands : function(val) {
			const _url = '/resman/brands?eqptType=' + val;
			return this.$http.get(_url).then((response) => {
				if (response.code === 0) {
					if (val === '9') {
						this.select.sourceBrands = response.data;
					} else if (val === '8') {
						this.select.hardDiskBrands = response.data;
					} else if (val === '7') {
						this.select.memoryBrands = response.data;
					} else if (val === '6') {
						this.select.cpuBrands = response.data;
					} else if (val === '10') {
						this.select.netCardBrands = response.data;
					} else {
						this.select.brandType = response.data;
					}
				} else {
					console.log(response.statusText)
				}
			}).catch((response) => {
				setTimeout(() => {
				}, 400);
				console.log(response)
			});
		},
		getModels : function(val) {
			const _url = '/resman/models?eqptType=' + this.info.device_base.eqptType + '&brandId=' + val;
			return this.$http.get(_url).then((response) => {
				if (response.code === 0) {
					response.data.forEach(d => {
						d.modelId = String(d.modelId);
					});
					this.select.model = response.data;
				} else {
				}
			}).catch((response) => {
				setTimeout(() => {
				}, 400);
				console.log(response)
			});
		},
		getUnitName : function(val, idx, array) {
			array.forEach(c => {
				if (String(c.brandId) === String(val)) {
					this.info.device_unit[idx].brandName = c.brandName;
				}
			});
		},
		showWarning : function(msg, title) {
			this.$alert(msg, title, {
				showConfirmButton : false,
				showCancelButton : true,
				cancelButtonText : '关闭',
				type : 'warning'
			});
		},
		showSuccess : function(msg, title) {
			this.$alert(msg, title, {
				showConfirmButton : true,
				showCancelButton : false,
				confirmButtonText : '确定',
				type : 'success',
				callback : action => {
					this.show = false;
					this.$emit('success', this.info);
				}
			});
		},
		submitForm : function() {
			this.$refs['info'].validate((valid) => {
				if (valid) {
					let _url = '';
					if (this.operate === 'New') {
						_url += '/resman/device/server';
						this.$http.post(_url, this.info)
							.then((response) => {
								if (response.code === 0) {
									this.showSuccess('操作已成功', '');
								} else {
									this.showWarning(response.msg, '创建失败');
								}
							}).catch((response) => {
							console.log(response)
						})
					} else if (this.operate === 'Update') {
						_url += '/resman/device/server';
						this.$http.put(_url, this.info).then((response) => {
							if (response.code === 0) {
								this.showSuccess('操作已成功', '');
							} else {
								this.showWarning(response.msg, '修改失败');
							}
						}).catch((response) => {
							console.log(response)
						})
					}
				} else {
					console.log('error submit!!');
					return false;
				}
			});
		},
	},
}	
</script>